<!DOCTYPE html>
<html lang="zh">

<head>
    <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta charset="utf-8">
    <title>首页</title>
    <meta name="keywords" />
    <meta name="description" />
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="./static/css/animate.min.css">
    <link rel="stylesheet" href="./static/css/common.css">
    <link rel="stylesheet" href="./static/css/swiper.css">
    <link rel="stylesheet" href="./static/css/index.css">
    <link rel="stylesheet" href="./static/css/locomotive-scroll.css">
    <style>
        .cursor {
            position: fixed;
            z-index: 9999;
            width: 8rem;
            height: 8rem;
            pointer-events: none;
        }

        .cursor .jump {
            width: 100%;
            height: 100%;
            position: fixed;
            z-index: 9999;
            background: #02C4D0;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            transform: scale(0);
            transition-timing-function: cubic-bezier(0.135, 0.9, 0.15, 1);
            transition-duration: .4s;

        }

        .cursor .jump.on {
            transform: scale(1);
        }

        .cursor img {
            width: 3rem;
        }
    </style>
</head>

<body>
    <div class="home">

        <div class="cursor" data-speed="8">
            <div class="jump">
                <img src="./static/images/cursor.png" alt="">
            </div>
        </div>

        <div class="header">
            <div class="box">
                <a href="./index.html" class="logo animated fadeInUp">
                    <img src="./static/images/logo-white.png" alt="">
                </a>
                <div class="links">
                    <div class="item animated fadeInUp" style="animation-delay: 100ms;">
                        <a href="./index.html" class="a1 active">首页</a>
                    </div>
                    <div class="item animated fadeInUp" style="animation-delay: 200ms;">
                        <a href="./about.html" class="a1">关于</a>
                    </div>
                    <div class="item animated fadeInUp" style="animation-delay: 300ms;">
                        <a href="./cases.html" class="a1">案例</a>
                    </div>
                    <div class="item animated fadeInUp" style="animation-delay: 400ms;">
                        <a href="./service.html" class="a1">服务</a>
                    </div>
                    <div class="item animated fadeInUp" style="animation-delay: 500ms;">
                        <a href="./ideas.html" class="a1">观点</a>
                    </div>
                    <div class="item animated fadeInUp" style="animation-delay: 600ms;">
                        <a href="./contact.html" class="a1">联系</a>
                    </div>
                </div>
                <div class="rb">
                    <div class="lan animated fadeInUp" style="animation-delay: 700ms;">
                        <a href="">ENG</a>
                        <p>中文</p>
                    </div>
                    <a class="contact each_btn animated fadeInUp" href="./contact.html" style="animation-delay: 800ms;">
                        <div class="text">
                            <p>定制专属方案</p>
                        </div>
                    </a>
                </div>
            </div>
        </div>

        <div class="pheader">
            <div class="menu">
                <a href="./index.html" target="_self" class="animated fadeInLeft">
                    <img src="./static/images/logo.png" alt="">
                </a>
                <div class="navbox">
                    <div class="line"></div>
                    <div class="line"></div>
                    <div class="line"></div>
                </div>
            </div>
        </div>
        <div class="menuList">
            <div class="item">
                <a href="./about.html">关于</a>
            </div>
            <div class="item">
                <a href="./cases.html">案例</a>
            </div>
            <div class="item">
                <a href="./service.html">服务</a>
            </div>
            <div class="item">
                <a href="./ideas.html">观点</a>
            </div>
            <div class="item">
                <a href="./contact.html">联系</a>
            </div>
            <div class="bottom">
               <div class="box1">
                <div class="p1">数字营销全面诊断，定制专属增长方案</div>
                <a class="contact" href="./contact.html" >
                    定制专属方案
                </a>
               </div>
               <div class="box2">
                 <p class="p1">业务咨询</p>
                 <a href="tel:15257713337">
                    152-5771-3337
                 </a>
               </div>
                
            </div>
        
        </div>

        <div class="getWay">
            <div class="book">
                <div class="icon">
                    <img src="./static/images/book.png" alt="">
                </div>
            </div>
            <a href="" class="get">
                获取<br>
                方案
            </a>
            <div class="zx">
                <div class="icon">
                    <img src="./static/images/zx.png" alt="">
                </div>
                <p>咨询</p>
                <div class="code">
                    <img src="./static/images/code.png" alt="">
                </div>
            </div>
        </div>

        <a class="want" href="./contact.html">
            <img class="pic1" src="./static/images/wbg.png" alt="">
            <div class="icon">
                <img src="./static/images/guest.png" alt="">
            </div>
        </a>

        <div data-scroll-container>
            <div class="banner">
                <div class="bg">
                    <!-- <img src="./static/images/banner.png" alt=""> -->
                    <video id="video" preload="metadata" loop="loop" autoplay muted="muted" playsinline="playsinline"
                    webkit-playsinline="webkit-playsinline" x5-video-player-type="h5" x5-video-player-fullscreen="true"
                    data-object-fit="cover" x5-video-orientation="portrait" data-autoplay="">
                    <source
                        src="https://qiniu.mfdemo.cn/songyan/video.mp4">
                </video>
                </div>
                <div class="text">
                    <div class="p1 animated fadeInUp">
                        专注提供数字化<br>
                        视觉解决方案</div>
                    <div class="p2 animated fadeInUp" style="animation-delay: 400ms;">我们以强大的创意和技术作为驱动力为企业打造超级品牌形象</div>
                </div>
                <div class="customer">
                    <div class="scroll-container">
                        <div class="animate_box">
                            <div class="flex-xb">
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac13acb46f.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220310/6229f2c231fe8.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac13436e35.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220310/6229f3fe4c10d.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac0d9661b3.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac0ebcb306.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac105c45fc.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac12712476.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac1612bb3b.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20240414/661b82a5e4ab7.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac86e7f972.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220501/626e05fa4b873.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220408/625058c8086e9.png" alt="">
                                </div>
                            </div>
                            <div class="flex-xb">
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac13acb46f.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220310/6229f2c231fe8.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac13436e35.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220310/6229f3fe4c10d.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac0d9661b3.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac0ebcb306.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac105c45fc.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac12712476.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac1612bb3b.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20240414/661b82a5e4ab7.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220311/622ac86e7f972.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220501/626e05fa4b873.png" alt="">
                                </div>
                                <div class="icon">
                                    <img src="http://www.u-sound.cn/uploads/image/20220408/625058c8086e9.png" alt="">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="section1" id="scence">
                <div class="t">
                    <p class="wow fadeInUp">我们是一个</p>
                    <p class="wow fadeInUp">集创意、策划、设计</p>
                    <p class="wow fadeInUp">开发于一身的创新团队</p>
                </div>
                <div class="intro">
                    <div class="des wow fadeInUp">
                        团队由业界资深设计师于2019年成立,致力于为国内外品牌和企业提供极致的数字创意服务，为重塑新一代互联网用户体验，我们的奇思妙想帮助企业率先触摸未来。我们的工作永远以客户为中心，从策略、创意、设计，到可扩展的品牌数字化、商务、移动和数字平台，我们愿始终于合作客户并肩作战，联合创新，共同实现价值。
                    </div>
                    <div class="des wow fadeInUp">
                        <p>帮助品牌数字形象从无到有的孵化，让想法成为现实</p>
                        <p>打造具有体现品牌特色数字体验</p>
                        <p>好奇并努力创新，挑战给定的解决方案</p>
                        <p>帮助客户的品牌成就独特个性、顺应变革、并引领行业</p>
                    </div>
                </div>
                <a class="btn each_btn wow fadeInUp" href="./contact.html">
                    <img src="./static/images/jt2.png" alt="">
                    <div class="text">
                        <p>去了解更多信息</p>
                    </div>
                </a>
                <div class="circle">
                    <img class="layer" data-depth=".2" src="./static/images/circle.png" alt="">
                </div>
            </div>

            <div class="section2" id="scence2">
                <div class="notice">
                    <p data-text="U-SOUND">U-SOUND</p>
                    <p class="stroke" data-text="studio">studio</p>
                </div>
                <div class="l">
                    <div class="t wow fadeInUp">
                        <p>我们的服务<br>本能且与众<br>不同
                        </p>
                    </div>
                    <a class="btn each_btn wow fadeInUp" href="./service.html">
                        <img src="./static/images/jt2.png" alt="">
                        <div class="text">
                            <p>去了解更多信息</p>
                        </div>
                    </a>
                </div>
                <div class="r">
                    <div class="intro wow fadeInUp">
                        <div class="des">
                            我们希望每一个客户都为自己的项目感到自豪，并对您的决定充满信心，应凡互动体验是您创意的延伸。我们共同做出正确的选择，我们的专家为您提供咨询与指导。团队间紧密合作，共同创造独特而难忘的数字体验。如果您有热情并愿与我们分享对数字媒体的构想，请告诉我们！
                        </div>
                        <div class="des">
                            锻造并执行令人兴奋的数字创意和概念。通过商业设计来做到，线性和非线性，理性和非理性，现实主义和直觉的接口上。洞察力和分析与大胆，让优雅、技术和一丝不苟的执行力相结合的方法。
                        </div>
                    </div>
                    <div class="list wow fadeInUp">
                        <div class="item">
                            <p>品牌官网设计</p>
                            <p>企业官网设计</p>
                            <p>互动网站设计</p>
                            <p>网上商城</p>
                            <p>移动端定制</p>
                            <p>H5定制</p>
                            <p>微信小程序</p>
                            <p>品牌设计</p>
                        </div>
                        <div class="item">
                            <p>咨询和用户体验设计</p>
                            <p>网络和应用开发</p>
                            <p>业务系统设计</p>
                            <p>网站结构规划</p>
                        </div>
                    </div>
                </div>
                <div class="circle">
                    <img class="layer" data-depth=".2" src="./static/images/circle.png" alt="">
                </div>
            </div>

            <div class="section3" id="scence3">
                <div class="dt">
                    <div class="t wow fadeInUp">
                        <p>
                            那些因我们助力<br>
                            而发生改变的品牌
                        </p>
                    </div>
                    <div class="des wow fadeInUp">
                        <p>我们的创新思维永无极限</p>
                        <p>不断探索动态和可持续的设计方式</p>
                        <p>在密切与品牌合作，创造独特而难忘的数字体验</p>
                    </div>
                </div>
                <div class="list">
                    <a href="./caseInfo.html" class="item">
                        <div class="pic">
                            <img src="./static/images/cases1.png" alt="">
                            <div class="hover">
                                <svg class="svg1" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0"
                                    viewBox="0 0 100 100">
                                    <path d="M98.1 0h1.9v51.9h-1.9c0-27.6-22.4-50-50-50V0h50z"></path>
                                </svg>
                                <div class="tags">
                                    <p>网站建设</p>
                                    <p>品牌策划</p>
                                    <p>SEO</p>
                                </div>
                            </div>
                        </div>
                        <div class="tag">
                            <p class="time">2023</p>
                            <span class="dot"></span>
                            <p class="name">万科丨南头古城</p>
                        </div>
                        <div class="title">帮助全球500强企业突破数字营销瓶颈，实现获客量大幅增长</div>
                    </a>
                    <a href="./caseInfo.html" class="item">
                        <div class="pic">
                            <img src="./static/images/case2.png" alt="">
                            <div class="hover">
                                <svg class="svg1" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0"
                                    viewBox="0 0 100 100">
                                    <path d="M98.1 0h1.9v51.9h-1.9c0-27.6-22.4-50-50-50V0h50z"></path>
                                </svg>
                                <div class="tags">
                                    <p>网站建设</p>
                                    <p>品牌策划</p>
                                    <p>SEO</p>
                                </div>
                            </div>
                        </div>
                        <div class="tag">
                            <p class="time">2023</p>
                            <span class="dot"></span>
                            <p class="name">沃尔玛</p>
                        </div>
                        <div class="title">现代城市与古城新旧文化交融的景区官网</div>
                    </a>
                    <a href="./caseInfo.html" class="item">
                        <div class="pic">
                            <img src="./static/images/case3.png" alt="">
                            <div class="hover">
                                <svg class="svg1" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0"
                                    viewBox="0 0 100 100">
                                    <path d="M98.1 0h1.9v51.9h-1.9c0-27.6-22.4-50-50-50V0h50z"></path>
                                </svg>
                                <div class="tags">
                                    <p>网站建设</p>
                                    <p>品牌策划</p>
                                    <p>SEO</p>
                                </div>
                            </div>
                        </div>
                        <div class="tag">
                            <p class="time">2023</p>
                            <span class="dot"></span>
                            <p class="name">咨询行业</p>
                        </div>
                        <div class="title">现代城市与古城新旧文化交融的景区官网</div>
                    </a>
                    <a href="./caseInfo.html" class="item">
                        <div class="pic">
                            <img src="./static/images/cases1.png" alt="">
                            <div class="hover">
                                <svg class="svg1" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0"
                                    viewBox="0 0 100 100">
                                    <path d="M98.1 0h1.9v51.9h-1.9c0-27.6-22.4-50-50-50V0h50z"></path>
                                </svg>
                                <div class="tags">
                                    <p>网站建设</p>
                                    <p>品牌策划</p>
                                    <p>SEO</p>
                                </div>
                            </div>
                        </div>
                        <div class="tag">
                            <p class="time">2023</p>
                            <span class="dot"></span>
                            <p class="name">咨询行业</p>
                        </div>
                        <div class="title">帮助全球500强企业突破数字营销瓶颈，实现获客量大幅增长</div>
                    </a>
                    <a href="./caseInfo.html" class="item">
                        <div class="pic">
                            <img src="./static/images/cases1.png" alt="">
                            <div class="hover">
                                <svg class="svg1" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0"
                                    viewBox="0 0 100 100">
                                    <path d="M98.1 0h1.9v51.9h-1.9c0-27.6-22.4-50-50-50V0h50z"></path>
                                </svg>
                                <div class="tags">
                                    <p>网站建设</p>
                                    <p>品牌策划</p>
                                    <p>SEO</p>
                                </div>
                            </div>
                        </div>
                        <div class="tag">
                            <p class="time">2023</p>
                            <span class="dot"></span>
                            <p class="name">万科丨南头古城</p>
                        </div>
                        <div class="title">帮助全球500强企业突破数字营销瓶颈，实现获客量大幅增长</div>
                    </a>
                    <a href="./caseInfo.html" class="item">
                        <div class="pic">
                            <img src="./static/images/case2.png" alt="">
                            <div class="hover">
                                <svg class="svg1" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0"
                                    viewBox="0 0 100 100">
                                    <path d="M98.1 0h1.9v51.9h-1.9c0-27.6-22.4-50-50-50V0h50z"></path>
                                </svg>
                                <div class="tags">
                                    <p>网站建设</p>
                                    <p>品牌策划</p>
                                    <p>SEO</p>
                                </div>
                            </div>
                        </div>
                        <div class="tag">
                            <p class="time">2023</p>
                            <span class="dot"></span>
                            <p class="name">沃尔玛</p>
                        </div>
                        <div class="title">现代城市与古城新旧文化交融的景区官网</div>
                    </a>
                    <a href="./caseInfo.html" class="item">
                        <div class="pic">
                            <img src="./static/images/case3.png" alt="">
                            <div class="hover">
                                <svg class="svg1" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0"
                                    viewBox="0 0 100 100">
                                    <path d="M98.1 0h1.9v51.9h-1.9c0-27.6-22.4-50-50-50V0h50z"></path>
                                </svg>
                                <div class="tags">
                                    <p>网站建设</p>
                                    <p>品牌策划</p>
                                    <p>SEO</p>
                                </div>
                            </div>
                        </div>
                        <div class="tag">
                            <p class="time">2023</p>
                            <span class="dot"></span>
                            <p class="name">咨询行业</p>
                        </div>
                        <div class="title">现代城市与古城新旧文化交融的景区官网</div>
                    </a>
                    <a href="./caseInfo.html" class="item">
                        <div class="pic">
                            <img src="./static/images/cases1.png" alt="">
                            <div class="hover">
                                <svg class="svg1" version="1.1" xmlns="http://www.w3.org/2000/svg" x="0" y="0"
                                    viewBox="0 0 100 100">
                                    <path d="M98.1 0h1.9v51.9h-1.9c0-27.6-22.4-50-50-50V0h50z"></path>
                                </svg>
                                <div class="tags">
                                    <p>网站建设</p>
                                    <p>品牌策划</p>
                                    <p>SEO</p>
                                </div>
                            </div>
                        </div>
                        <div class="tag">
                            <p class="time">2023</p>
                            <span class="dot"></span>
                            <p class="name">咨询行业</p>
                        </div>
                        <div class="title">帮助全球500强企业突破数字营销瓶颈，实现获客量大幅增长</div>
                    </a>
                </div>
                <a href="./cases.html" class="btn layer" data-depth=".2">
                    <img src="./static/images/circle.png" alt="">
                    <p>去查看全部案例</p>
                </a>
            </div>

            <div class="section4">
                <div class="tag wow fadeInUp">
                    观点
                </div>
                <div class="dt">
                    <div class="lt wow fadeInUp">
                        <p>聚焦于</p>
                        <span></span>
                        <p class="blue">探索真实客观的增长方法</p>
                    </div>
                    <div class="r wow fadeInUp">
                        <a class="btn each_btn" href="./ideas.html">
                            <img src="./static/images/jt2.png" alt="">
                            <div class="text">
                                <p>去查看全部观点</p>
                            </div>
                        </a>
                    </div>
                </div>
                <div class="news">
                    <div class="swiper-container">
                        <div class="swiper-wrapper">
                            <div class="swiper-slide">
                                <a href="./newsInfo.html">
                                    <div class="pic">
                                        <img src="./static/images/news1.png" alt="">
                                    </div>
                                    <div class="text">
                                        <div class="title">
                                            B2B企业做好新媒体营销的重点是营
                                            销矩阵
                                        </div>
                                        <div class="des">
                                            企业要保持长期稳步的发展，搭建新媒体营销矩阵，形成自己的竞争壁垒是必须要做的。企业要保持长期稳步的发展，搭建新媒体营销矩阵，形成自己的竞争壁垒是必须要做的...
                                        </div>
                                        <div class="time">
                                            2024年1月24日
                                        </div>
                                    </div>
                                </a>
                            </div>
                            <div class="swiper-slide">
                                <a href="./newsInfo.html">
                                    <div class="pic">
                                        <img src="./static/images/news2.png" alt="">
                                    </div>
                                    <div class="text">
                                        <div class="title">
                                            数字营销里的“聚光灯”，企业应该如何做好SEM
                                        </div>
                                        <div class="des">
                                            企业要保持长期稳步的发展，搭建新媒体营销矩阵，形成自己的竞争壁垒是必须要做的。企业要保持长期稳步的发展，搭建新媒体营销矩阵，形成自己的竞争壁垒是必须要做的...
                                        </div>
                                        <div class="time">
                                            2024年1月24日
                                        </div>
                                    </div>
                                </a>
                            </div>
                            <div class="swiper-slide">
                                <a href="./newsInfo.html">
                                    <div class="pic">
                                        <img src="./static/images/news3.png" alt="">
                                    </div>
                                    <div class="text">
                                        <div class="title">
                                            B2B企业做好新媒体营销的重点是营
                                            销矩阵
                                        </div>
                                        <div class="des">
                                            企业要保持长期稳步的发展，搭建新媒体营销矩阵，形成自己的竞争壁垒是必须要做的。企业要保持长期稳步的发展，搭建新媒体营销矩阵，形成自己的竞争壁垒是必须要做的...
                                        </div>
                                        <div class="time">
                                            2024年1月24日
                                        </div>
                                    </div>
                                </a>
                            </div>
                            <div class="swiper-slide">
                                <a href="./newsInfo.html">
                                    <div class="pic">
                                        <img src="./static/images/news1.png" alt="">
                                    </div>
                                    <div class="text">
                                        <div class="title">
                                            B2B企业做好新媒体营销的重点是营
                                            销矩阵
                                        </div>
                                        <div class="des">
                                            企业要保持长期稳步的发展，搭建新媒体营销矩阵，形成自己的竞争壁垒是必须要做的。企业要保持长期稳步的发展，搭建新媒体营销矩阵，形成自己的竞争壁垒是必须要做的...
                                        </div>
                                        <div class="time">
                                            2024年1月24日
                                        </div>
                                    </div>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="section5">
                <div class="bg">
                    <img src="./static/images/b.png" alt="">
                </div>
                <div class="text">
                    来一场关于你的项目讨论会？
                </div>
                <a href="" class="btn">
                    <img class="ball" src="./static/images/ball.png" alt="">
                    <div class="en">
                        <img src="./static/images/en.png" alt="">
                    </div>
                    <p>
                        立即<br>
                        预约
                    </p>
                    <img class="icon" src="./static/images/jt3.png" alt="">
                </a>
            </div>

            <div class="foot">
                <div class="dom1">
                    <div class="d1">
                        <div class="dbox">
                            <div class="dl">
                                <div class="logo">
                                    <img src="./static/images/logo.png" alt="">
                                </div>
                                <div class="st">数字化策略与营销专家</div>
                                <div class="sr">
                                    <input type="text" placeholder="输入手机号,即刻体验">
                                    <div class="btn">确定</div>
                                </div>
                            </div>
                            <div class="dc">
                                <a href="">关于</a>
                                <a href="">案例</a>
                                <a href="">服务</a>
                                <a href="">观点</a>
                                <a href="">联系</a>
                            </div>
                            <div class="dr">
                                <div class="item">
                                    <div class="t">官网</div>
                                    <span></span>
                                    <a href="">
                                        企业官网定制开发
                                    </a>
                                    <div class="icon">
                                        <img src="./static/images/jt.png" alt="">
                                    </div>
                                </div>
                                <div class="item">
                                    <div class="t">产品</div>
                                    <span></span>
                                    <a href="">
                                        web/app/小程序开发
                                    </a>
                                    <div class="icon">
                                        <img src="./static/images/jt.png" alt="">
                                    </div>
                                </div>
                                <div class="item">
                                    <div class="t">转化</div>
                                    <span></span>
                                    <a href="">
                                        sem效果提升
                                    </a>
                                    <div class="icon">
                                        <img src="./static/images/jt.png" alt="">
                                    </div>
                                </div>
                                <div class="item">
                                    <div class="t">流量</div>
                                    <span></span>
                                    <a href="">
                                        SEO排名优化
                                    </a>
                                    <div class="icon">
                                        <img src="./static/images/jt.png" alt="">
                                    </div>
                                </div>
                                <div class="item">
                                    <div class="t">传播</div>
                                    <span></span>
                                    <a href="">
                                        SEO排名优化
                                    </a>
                                    <div class="icon">
                                        <img src="./static/images/jt.png" alt="">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="dlink">
                            <p>友情链接</p>
                            <div class="as">
                                <a href="">数阔云听cem</a>
                                <a href="">企业直播</a>
                                <a href="">营销自动化</a>
                            </div>
                        </div>
                    </div>
                    <div class="d2">
                        <div class="dbox">
                            <div class="t1">每个品牌都需要精心策划</div>
                            <div class="t2">点击下方按钮，立即免费获取</div>
                            <a class="btn each_btn" href="./contact.html">
                                <img src="./static/images/jt2.png" alt="">
                                <div class="text">
                                    <p>免费获取</p>
                                </div>
                            </a>
                            <div class="pic">
                                <img class="pic1" src="./static/images/fbg1.png" alt="">
                                <div class="pic2">
                                    <img src="./static/images/fp.png" alt="">
                                </div>
                            </div>
                        </div>
                        <div class="dInfo">
                            <div class="t">业务咨询</div>
                            <div class="dc">
                                <div class="phone">152-5771-3337</div>
                                <div class="wxchat">
                                    <p>微信咨询</p>
                                    <div class="icon">
                                        <img src="./static/images/wx.png" alt="">
                                    </div>
                                    <div class="code">
                                        <img src="./static/images/code.png" alt="">
                                    </div>
                                </div>
                            </div>
                            <a class="email" href="mailto:627603421@qq.com" target="_blank">
                                627603421@qq.com
                            </a>
                        </div>
                    </div>
                </div>
                <div class="dom2">
                    <p>© 2024 优升网络科技 Rights Reserved.</p>
                    <a class="bei" href="https://beian.miit.gov.cn/" target="_blank">滇ICP备2022001335号</a>
                    <div class="links">
                        <a href="">网站声明</a>
                        <span></span>
                        <a href="">隐私政策</a>
                    </div>
                </div>
            </div>
        </div>




    </div>
    <script src="./static/js/jquery-3.6.1.min.js"></script>
    <script src="./static/js/swiper.js"></script>
    <script src="./static/js/wow.min.js"></script>
    <script src="./static/js/countUp.js"></script>
    <script src="./static/js/gsap.min.js"></script>
    <script src="./static/js/jquery.parallax.js"></script>
    <script src="./static/js/ScrollTrigger.min.js"></script>
    <script src="./static/js/locomotive-scroll.js"></script>
    <script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script src="./static/js/common.js"></script>
    <script>
        // new WOW().init();



        if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) { //判断iPhone|iPad|iPod|iOS
            document.addEventListener("WeixinJSBridgeReady", function () {
                document.getElementById("video").play();
            }, false);
        }

        var swiper = new Swiper('.news .swiper-container', {
            speed: 1000,
            init: true,
            slidesPerView: 1,
            spaceBetween: 20,
            autoplay: {
                delay: 3000,
                stopOnLastSlide: false,
                disableOnInteraction: false,
            },
            breakpoints: {
                1024: {  //当屏幕宽度大于等于1280
                    slidesPerView: 3,
            spaceBetween: 40,
                }
            }
        });

        $('#scence').parallax();
        $('#scence2').parallax();
        $('#scence3').parallax();


        let locomotive, scrollTop;
        window.addEventListener('load', function () {
            if (document.querySelector('[data-scroll-container]')) {
                locomotive = new LocomotiveScroll({ el: document.querySelector('[data-scroll-container]'), smooth: true, lerp: 0.09, });
                locomotive.on('scroll', function (position) {
                    scrollTop = position.scroll.y;

                    WOW.init();

                    var a = $('.notice').offset().top - document.documentElement.clientHeight
                    if (scrollTop >= a) {
                        $('.home .section2 .notice').css('transform', 'translateX(' + (scrollTop * -0.4) + 'px)')
                    }

                    var speed = scrollTop * 0.5
                    $('.home .banner .bg').css('transform', 'translateY(' + speed + 'px)')

                    $('.home .section3 .list .item .pic').each(function (i, e) {
                        var off = ($(e).position().top + $('.section3').position().top) - document.documentElement.clientHeight
                        if (scrollTop >= off) {
                            var data_ = (scrollTop - off) * +0.2
                            $(e).find('img').css('transform', 'translate3d(0px,' + data_ + 'px,0px)')
                        }
                    })



                });
            }
        })


        !function () {
            let d = document.querySelector(".cursor"),
                speed = document.querySelector('.cursor').getAttribute('data-speed')
            if (speed === null) {
                speed = 0.9
            } else {
                speed = speed / 10
            }
            function S() {
                d && function (e) {
                    gsap.set(e, {
                        xPercent: -50,
                        yPercent: -50
                    });
                    let t = e,
                        r = {
                            x: window.innerWidth / 2,
                            y: window.innerHeight / 2
                        },
                        o = {
                            x: r.x,
                            y: r.y
                        },
                        a = gsap.quickSetter(t, "x", "px"),
                        n = gsap.quickSetter(t, "y", "px");
                    document.body.addEventListener("mousemove", e => {
                        o.x = e.x, o.y = e.y
                    }), gsap.ticker.add(() => {
                        const e = 1 - Math.pow(speed, gsap.ticker.deltaRatio());
                        r.x += (o.x - r.x) * e, r.y += (o.y - r.y) * e, a(r.x), n(r.y)
                    })
                }(d)
            }
            window.addEventListener("DOMContentLoaded", () => {
                S();
            })
        }();

        $('.home .section3 .list .item').hover(function () {
            $('.cursor .jump').addClass('on')
        }, function () {
            $('.cursor .jump').removeClass('on')
        })

        $('.each_btn').each(function (i, e) {
            var text = $(e).find('p').text()
            var split = text.split('')
            var html = '';
            for (let j = 0; j < split.length; j++) {
                html += `<div>${split[j]}</div>`
            }
            $(e).find('.text').html(html)

            $(e).find('.text').append('<div class="inset">' + html + '</div>')

            $(e).hover(function () {
                $(e).find('.text > div:not(.inset)').each(function (i, e) {
                    var delay = i * 0.05
                    $(e).css('transition-delay', delay + 's')
                })
                $(e).find('.text .inset div').each(function (index, ele) {
                    var delay2 = (($(e).find('.text > div:not(.inset)').length * 0.05)) + (index * 0.05)
                    $(ele).css('transition-delay', delay2 + 's')
                })
                $(e).find('.text div:not(.inset)').css('opacity', '0')
                $(e).find('.text .inset div').css('opacity', '1')
            }, function () {

                $(e).find('.text > div:not(.inset)').get().reverse().forEach(function (el, i) {
                    var delay = (($(e).find('.text > div:not(.inset)').length * 0.05)) + (i * 0.05)
                    $(el).css('transition-delay', delay + 's');
                });

                $(e).find('.text .inset div').get().reverse().forEach(function (el, i) {
                    var delay2 = i * 0.05
                    $(el).css('transition-delay', delay2 + 's')
                })

                $(e).find('.text div:not(.inset)').css('opacity', '1')
                $(e).find('.text .inset div').css('opacity', '0')

            })

        })

    </script>
</body>

</html>